<template>
  <page-header-wrapper>
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
          <a-row type="flex" justify="start">
            <span
              v-for="status in AuditStatusArray"
              :key="status.code"
              @click="selected(status.code)"
              style="margin-right: 60px"
              :class="{'active': status.code == auditStatus}"
              class="mouseOn"
            >
              {{ status.message }}
            </span>
          </a-row>
          <a-row type="flex" justify="start" style="margin: 20px 0" >
            <a-col :span="4" style="margin-right: 10px">
              <a-input v-model="value" placeholder="输入关键字" allow-clear></a-input>
            </a-col>
            <a-col :span="4">
              <a-config-provider :auto-insert-space-in-button="false">
                <a-button type="primary" @click="toSearch">
                  查找
                </a-button>
              </a-config-provider>
            </a-col>
          </a-row>
        </div>
      <a-table
        :scroll="{ x: 1500}"
        :columns="columns"
        :data-source="info"
        bordered
        :pagination="pagination"
        :rowKey="record=>record.id"
      >
        <div slot="content" slot-scope="text,record">
          <a  @click="toContent(record.id)">{{record.auditStatus === 1 ? "审核" : "查看"}}</a>
        </div>
      </a-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>
const AuditStatusArray = [
  {
    code: 0,
    message: '全部',
  },
  {
    code: 1,
    message: '审核中',
  },
  {
    code: 2,
    message: '已通过',
  },
  {
    code: 3,
    message: '未通过',
  },
]
import { GetSearchPageList } from '@/api/Solution'
export default {
  data() {
    return {
      value:'',
      auditStatus: 0,
      AuditStatusArray: AuditStatusArray,
      pagination: {
        total: 0,
        pageSize: 10,
        current: 1,
        showSizeChanger: true,
        pageSizeOptions: ['10', '20', '30', '40', '50'],
        showTotal: total => `共有 ${total} 条数据`,
        showQuickJumper: true,
        showSizeChanger: true,
        onShowSizeChange: (current, pageSize) => this.onSizeChange(current, pageSize),
        onChange: (page, pageSize) => this.onPageChange(page, pageSize)
      },
      columns: [
        {
          title: '编号',
          dataIndex: 'solutionNo',
          align: 'center'
        },
        {
          title: '解决方案名称',
          dataIndex: 'solutionName',
          // align: 'center'
        },
       
        {
          title: '创建时间',
          dataIndex: 'createTime',
          align: 'center',
        },
        // {
        //   title: '更新时间',
        //   dataIndex: 'updateTime',
        //   align: 'center',
        // },
        {
          title: '状态',
          dataIndex: 'auditStatus',
          align: 'center',
          customRender:function (text) {
              if(text==1){
                return "审核中"
              }else if(text==2){
                return "已通过"
              }else if(text==3){
                return "未通过"
              }
            }
        },
        {
          title: '操作',
          dataIndex: 'content',
          align: 'center',
          width:100,
          fixed: 'right',
          scopedSlots: { customRender: 'content' }
        }
      ],
      info: [],
    }
  },
  created() {
    this.GetSearchPageList()
  },
  methods: {
    toSearch(e) {
      this.pagination.current = 1
      this.GetSearchPageList(this.value,this.auditStatus);
    },
    selected(code) {
      this.pagination.current = 1
      this.auditStatus = code
      this.GetSearchPageList(this.value,this.auditStatus);
    },
    toContent(id) {
        this.$router.push({
          path: '/SolutioninfoVerify/VerifyInfo',
          query:{id}
        })
    },
    // 分页搜索
    onPageChange(page, pageSize) {
      this.pagination.current = page
      this.GetSearchPageList(this.value,this.auditStatus)
    },
    // 页容量改变
    onSizeChange(current, pageSize) {
      this.pagination.pageSize = pageSize
      this.pagination.current = current
      this.GetSearchPageList(this.value,this.auditStatus)
    },
    // 获取列表
    GetSearchPageList(keyword, auditStatus) {
      let _params = {
        size: this.pagination.pageSize,
        current: this.pagination.current,
        keyword,
        auditStatus:this.auditStatus
      }
      GetSearchPageList(_params).then(res => {
        console.log(res)
        if (res.code == 200) {
          this.info = res.data.records
          this.pagination.total = res.data.total;
          console.log(this.info)
        }
      })
    }
  },
  computed: {
    rowSelection() {
      return {
        onChange: (selectedRowKeys, selectedRows) => {
          // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
        }
      }
    }
  }
}
</script>

<style lang="less" scoped>
.active {
  color: #1890ff !important;
}
.mouseOn:hover {
  cursor: pointer;
  color: #1890ff !important;
}
</style>
